* {
    padding: 0;
    margin: 0;
}

a {
    text-decoration: none
}

html,
body {
    width: 100%;
    height: 100%;
}

.main {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column
}

.navbar {
    width: 100%;
    height: 50px;
    padding: 0 10px;
    box-sizing: border-box;
    display: flex;
    background: rgb(169, 240, 37);
    border-bottom: 1px solid #aaa
}

.navbar div a {
    display: inline-block;
    line-height: 50px;
    padding: 0 20px;
    box-sizing: border-box;
}

.active,
.navbar div:hover {
    background: #aaa !important;
}

.content {
    flex: 1;
    display: flex;
}
.content_l{
    width: 200px;
    background: rgb(255, 255, 255)));
}
.content_l ul li{
    width: 100%;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
    background: #eee;
}
.content_l ul li a{
    display: block;
    padding: 0 30px;
    width: 100%;
    height: 100%;
}
.content_r{
    flex: 1;
    background: #f5f5f5;
}